<template>
    <div>
      <x-header title="修改订单地址" style="background-color: #33bb99;width:100%;position: fixed;top:0;z-index: 99;">
        <span slot="overwrite-left" @click="back" class="iconfont icon-shangyiyedanjiantou" style="color: #fff;font-size: 22px;"></span>
      </x-header>
      <group label-width="4.5em" label-margin-right="2em" label-align="right" style="margin: 50px auto 0;">
        <x-address title="地址选择" v-model="addressValue" raw-value @on-shadow-change="onShadowChange" :list="addressData" value-text-align="left"></x-address>
        <x-input title="详细地址" v-model="detailAddress"></x-input>
      </group>
      <div style="text-align: right;border-top: 1px #f1f1f1 solid;margin: 1rem;">
        <x-button style="background: #ffc655;color: #fff;" mini @click.native="back">取消</x-button>
        <x-button style="background: #33bb99;color: #fff;" mini @click.native="yes">确定</x-button>
      </div>
    </div>
</template>

<script>
  import { ChinaAddressData, XAddress, Group } from 'vux'
    export default {
      name: "",
      components:{
        XAddress, Group
      },
      props:['orderDetail'],
      data () {
        return {
          addressValue:[],
          addressData:ChinaAddressData,
          detailAddress:'',
          address:[]
        }
      },
      created(){
        this.addressValue = [this.orderDetail.prov,this.orderDetail.city,this.orderDetail.area,]
        this.detailAddress = this.orderDetail.detail_address
      },
      methods:{
        // 返回
        back(){
          this.$emit('toDetail',false);
        },
        onShadowChange (ids, names) {
          this.address = ids
          this.addressValue = names
        },
        yes(){
          if(this.address==''){
            this.msg('请填写详细地址');
            return false
          }
          if(this.detailAddress==''){
            this.msg('请填写详细地址');
            return false
          }
          this.$vux.loading.show();
          let obj = {
            'order.id':this.orderDetail.id,
            'order.provinces_id':this.address[0],
            'order.cities_id':this.address[1],
            'order.areas_id':this.address[2],
            'order.detail_address':this.detailAddress,
          }
          this.config0.post('/supply/appOrder/updateAddress', obj).then(res=>{
            this.$vux.loading.hide();
            if(res.data.code==='0'){
              this.msg(res.data.message);
              this.$emit('toDetail',true)
            }else{
              this.msg(this.config0.handleError(res.data));
            }
          })
        },
        // 信息提示
        msg(str){
          this.$vux.toast.show({
            type: 'text',
            text: str,
            position: 'default',
            time: 800,
          });
        },
      }
    }
</script>

<style scoped>
@import "../../../assets/css/font_975465_4qn59qnejbp/iconfont.css";

</style>
